<hr/>
<div class="row-fluid">
    <div class="span12">
        <button type="button" class="btn btn-success" id="btn_save">保存</button>
        <#if product.productId??>
            <a id="btn_addSku" class="btn btn-success" href="${request.contextPath}/product/skuDetail?productId=${product.productId}">设置规格</a>
        </#if>
        <a href="${request.contextPath}/product/infoList" class="btn btn-info" id="btn_back">返回列表</a>
        <div class="widget-box">
            <div class="widget-title"> <span class="icon"> <i class="icon-pencil"></i> </span>
                <h5>商品信息</h5>
            </div>
            <div class="widget-content nopadding">
                <form class="form-horizontal" method="post" action="${request.contextPath}/product/saveProduct" name="product_form" id="product_form">
                    <input type="hidden" name="productId" value="${product.productId}" />
                    <div class="control-group">
                        <label class="control-label">商品编号：</label>
                        <div class="controls">
                            <input type="text" name="productCode" value="${product.productCode}">
                        </div>
                    </div>
                    <div class="control-group">
                        <label class="control-label">商品名称：</label>
                        <div class="controls">
                            <input type="text" name="productName" value="${product.productName}">
                        </div>
                    </div>
                    <div class="control-group">
                        <label class="control-label">类型：</label>
                        <div class="controls">
                            <select name="catalogId">
                                <option value="">请选择</option>
                                <#list catalogList as catalog>
                                    <option value="${catalog.productCatalogId}" <#if catalog.productCatalogId == product.catalog.productCatalogId>selected</#if>>${catalog.catalogName}</option>
                                </#list>
                            </select>
                        </div>
                    </div>
                    <div class="control-group">
                        <label class="control-label">品牌：</label>
                        <div class="controls">
                            <select name="brandId">
                                <option value="">请选择</option>
                                <#list brandList as brand>
                                    <option value="${brand.productBrandId}" <#if brand.productBrandId == product.brand.productBrandId>selected</#if>>${brand.brandName}</option>
                                </#list>
                            </select>
                        </div>
                    </div>
                    <div class="control-group">
                        <label class="control-label">简介：</label>
                        <div class="controls">
                            <textarea class="" name="productIntro">${product.productIntro}</textarea>
                        </div>
                    </div>
                </form>
            </div>
        </div>

        <div class="widget-box">
            <div class="widget-title">
                <span class="icon"><i class="icon-reorder"></i></span>
                <h5>规格属性</h5>
            </div>
            <div class="widget-content">
                <table class="table table-bordered table-striped data-table">
                    <thead>
                    <tr>
                        <th>序号</th>
                        <th>编号</th>
                        <th>名称</th>
                        <th>规格属性</th>
                        <th>市场价</th>
                        <th>销售价</th>
                        <th>成本价</th>
                        <th>当前库存</th>
                        <th>操作</th>
                    </tr>
                    </thead>
                    <tbody>
                    <#list product.skuList as sku>
                        <tr id="tr_${sku.productSkuId}">
                            <td>${sku_index + 1}</td>
                            <td>${sku.skuCode}</td>
                            <td>${sku.skuName}</td>
                            <td>${sku.skuSpecs}</td>
                            <td>${sku.marketPrice}</td>
                            <td>${sku.sellPrice}</td>
                            <td>${sku.purchasePrice}</td>
                            <td>${sku.stockAmount}</td>
                            <td>
                                <a class="btn_edit" href="${request.contextPath}/product/skuDetail?productSkuId=${sku.productSkuId}&productId=${product.productId}"><i class="icon icon-pencil"></i></a>
                                <a class="btn_delete" href="#" data-key="${sku.productSkuId}"><i class="icon icon-remove"></i></a>
                            </td>
                        </tr>
                    </#list>
                    </tbody>
                </table>
            </div>
        </div>
    </div>
</div>
<script src="${request.contextPath}/js/jquery-1.12.2.min.js"></script>
<script src="${request.contextPath}/js/jquery.validate.js"></script>
<script src="${request.contextPath}/js/sweetalert.min.js"></script>
<script src="${request.contextPath}/js/select2.full.min.js"></script>
<script type="text/javascript">
    $(function(){

        $("#btn_back").click(function(){
            loadPage($(this).attr("href"));
            return false;
        });

        $("#btn_save").click(function(){
            $("#product_form").submit();
        });

        $("#btn_addSku").click(function(){
            loadPage($(this).attr("href"));
            return false;
        });

        $("#product_form").validate({
            submitHandler: function(form){
                $.ajax({
                    url: $(form).attr("action"),
                    type: "post",
                    data: $(form).serialize(),
                    success: function(result){
                        swal({
                            title: "信息提示",
                            text: result.status == "success" ? "恭喜，操作已完成！" : "很遗憾，操作失败了！",
                            type: result.status,
                            animation: "slide-from-top"
                        }, function(){
                            if (result.status == "success"){
                                loadPage("${request.contextPath}/product/infoDetail?productId=" + result.data);
                            }
                        });
                    }
                });
            },
            rules: {
                productName: {
                    "required": true
                },
                productCode: {
                    "required": true
                }
            },
            errorClass: "help-inline",
            errorElement: "span",
            highlight:function(element, errorClass, validClass) {
                $(element).parents('.control-group').addClass('error');
            },
            unhighlight: function(element, errorClass, validClass) {
                $(element).parents('.control-group').removeClass('error');
                $(element).parents('.control-group').addClass('success');
            }
        });

        $(".btn_edit").click(function(){
            loadPage($(this).attr("href"));
            return false;
        });

        $("td > .btn_delete").click(function(){
            var itemId = $(this).attr("data-key");
            swal({
                title: "信息提示",
                text: "真的要删了它？",
                type: "warning",
                showCancelButton: true,
                confirmButtonText: "是的",
                cancelButtonText: "算了",
                closeOnConfirm: false
            },
            function(isConfirm){
                if(isConfirm){
                    deleteItem(itemId);
                }
            });
            return false;
        });
    });

    function deleteItem(itemId){
        $.ajax({
            url: "${request.contextPath}/product/deleteSKU",
            type: "post",
            data: {
                productSkuId: itemId
            },
            success: function(result){
                swal({
                    title: "信息提示",
                    text: result.status == "success" ? "恭喜，操作已完成！" : "很遗憾，操作失败了！",
                    type: result.status,
                    animation: "slide-from-top",
                    closeOnConfirm: true
                }, function(){
                    if (result.status == "success"){
                        $("#tr_" + itemId).remove();
                    }
                });
            }
        });
    }
</script>